<template>
    <view class="mine_page flex-col">
        <view class="group_1 flex-row">
            <view class="section_1 flex-col">

                <view class="image-text_1 flex-col justify-between">
                    <image class="single-avatar_1" referrerpolicy="no-referrer"
                        src="https://mall-applets.oss-cn-chengdu.aliyuncs.com/static/MasterDDSSlicePNG0ca2ee975c067e1840217df23376e8b7.png" />
                    <text class="text-group_1">张艺欢</text>
                </view>
                <view class="box_3 flex-row justify-between">
                    <view class="box_4 flex-row" @click="toStore">
                        <view class="image-text_2 flex-row justify-between">
                            <image class="icon_1" referrerpolicy="no-referrer"
                                src="https://mall-applets.oss-cn-chengdu.aliyuncs.com/static/MasterDDSSlicePNG61eef596d5e7ead65b942f842d8e814c.png" />
                            <text class="text-group_2">我的收藏</text>
                        </view>
                        <image class="icon_2" referrerpolicy="no-referrer"
                            src="https://mall-applets.oss-cn-chengdu.aliyuncs.com/static/MasterDDSSlicePNG7f5ce93977e0aba6c2ee4f806c4a534e.png" />
                    </view>
                    <view class="box_5 flex-row" @click="toSet">
                        <view class="image-text_3 flex-row justify-between">
                            <image class="icon_3" referrerpolicy="no-referrer"
                                src="https://mall-applets.oss-cn-chengdu.aliyuncs.com/static/MasterDDSSlicePNG9ed8f04fefe3000f0db698a92bd9ffc4.png" />
                            <text class="text-group_3">我的信息</text>
                        </view>
                        <image class="icon_4" referrerpolicy="no-referrer"
                            src="https://mall-applets.oss-cn-chengdu.aliyuncs.com/static/MasterDDSSlicePNG7f5ce93977e0aba6c2ee4f806c4a534e.png" />
                    </view>
                </view>
                <view class="box_6 flex-col justify-between">
                    <view class="section_2 flex-row" @click="toNotice">
                        <view class="image-text_4 flex-row justify-between">
                            <image class="icon_5" referrerpolicy="no-referrer"
                                src="https://mall-applets.oss-cn-chengdu.aliyuncs.com/static/MasterDDSSlicePNG65e45f405c45301162b1159d64f56de6.png" />
                            <text class="text-group_4">消息中心</text>
                        </view>
                        <div class="icon_6 flex-col"></div>
                    </view>
                    <view class="section_3 flex-col" @click="toFeedback">
                        <view class="group_2 flex-col"></view>
                        <view class="group_3 flex-row justify-between">
                            <view class="image-text_5 flex-row justify-between">
                                <image class="icon_7" referrerpolicy="no-referrer"
                                    src="https://mall-applets.oss-cn-chengdu.aliyuncs.com/static/MasterDDSSlicePNG5d93f91f09ed1ff70fb25daab08602a4.png" />
                                <text class="text-group_5">意见反馈</text>
                            </view>
                            <div class="icon_8 flex-col"></div>
                        </view>
                    </view>
                    <view class="section_4 flex-col" @click="aboutUs">
                        <view class="block_2 flex-col"></view>
                        <view class="block_3 flex-row justify-between">
                            <view class="image-text_6 flex-row justify-between">
                                <image class="icon_9" referrerpolicy="no-referrer"
                                    src="https://mall-applets.oss-cn-chengdu.aliyuncs.com/static/MasterDDSSlicePNGfd36bfb96506a54dd6e80cbd0daa0b3f.png" />
                                <text class="text-group_6">关于我们</text>
                            </view>
                            <div class="icon_10 flex-col"></div>
                        </view>
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>
<script setup>
const toStore = () => {
    uni.navigateTo({
        url: '/pages/store/index'
    });
}

const toNotice = () => {
    uni.navigateTo({
        url: '/pages/notice_list/index'
    });
}

const toSet = () => {
    uni.navigateTo({
        url: '/pages/set/index'
    });
}

const toFeedback = () => {
    uni.navigateTo({
        url: '/pages/feedback/index'
    });
}

const aboutUs = () => {
    uni.navigateTo({
        url: '/pages/about_us/index'
    });
}
</script>
<style lang="scss" scoped>
.mine_page {
    position: relative;
    width: 750rpx;
    height: 100%;
    overflow: hidden;

    .group_1 {
        background-image: linear-gradient(180deg,
                rgba(255, 255, 255, 0.5) 0,
                rgba(249, 249, 249, 1) 42.206165%);
        width: 750rpx;
        height: 100%;

        .section_1 {
            width: 750rpx;
            height: 100%;

            .box_2 {
                width: 702rpx;
                height: 64rpx;
                margin: 34rpx 0 0 36rpx;

                .thumbnail_3 {
                    width: 18rpx;
                    height: 34rpx;
                    margin-top: 16rpx;
                }

                .text_2 {
                    width: 134rpx;
                    height: 40rpx;
                    overflow-wrap: break-word;
                    color: rgba(0, 0, 0, 0.9);
                    font-size: 34rpx;
                    font-family: AlibabaPuHuiTi-Regular;
                    font-weight: normal;
                    text-align: center;
                    white-space: nowrap;
                    line-height: 40rpx;
                    margin: 8rpx 0 0 256rpx;
                }
            }

            .image-text_1 {
                width: 176rpx;
                height: 256rpx;
                margin: 100rpx 0 0 288rpx;

                .single-avatar_1 {
                    width: 176rpx;
                    height: 176rpx;
                }

                .text-group_1 {
                    width: 156rpx;
                    height: 40rpx;
                    overflow-wrap: break-word;
                    color: rgba(51, 51, 51, 1);
                    font-size: 52rpx;
                    font-family: Songti SC-黑体;
                    font-weight: normal;
                    text-align: left;
                    white-space: nowrap;
                    line-height: 40rpx;
                    margin: 40rpx 0 0 10rpx;
                }
            }

            .box_3 {
                width: 690rpx;
                height: 124rpx;
                margin: 88rpx 0 0 30rpx;

                .box_4 {
                    background-color: rgba(255, 255, 255, 1);
                    border-radius: 4px;
                    width: 334rpx;
                    height: 124rpx;

                    .image-text_2 {
                        width: 176rpx;
                        height: 42rpx;
                        margin: 42rpx 0 0 30rpx;

                        .icon_1 {
                            width: 40rpx;
                            height: 40rpx;
                        }

                        .text-group_2 {
                            width: 126rpx;
                            height: 42rpx;
                            overflow-wrap: break-word;
                            color: rgba(0, 0, 0, 1);
                            font-size: 32rpx;
                            font-family: Helvetica, 'Microsoft YaHei', Arial, sans-serif;
                            font-weight: normal;
                            text-align: left;
                            white-space: nowrap;
                            line-height: 42rpx;
                        }
                    }

                    .icon_2 {
                        width: 44rpx;
                        height: 44rpx;
                        margin: 40rpx 20rpx 0 64rpx;
                    }
                }

                .box_5 {
                    background-color: rgba(255, 255, 255, 1);
                    border-radius: 4px;
                    width: 334rpx;
                    height: 124rpx;

                    .image-text_3 {
                        width: 176rpx;
                        height: 42rpx;
                        margin: 42rpx 0 0 30rpx;

                        .icon_3 {
                            width: 40rpx;
                            height: 40rpx;
                        }

                        .text-group_3 {
                            width: 126rpx;
                            height: 42rpx;
                            overflow-wrap: break-word;
                            color: rgba(0, 0, 0, 1);
                            font-size: 32rpx;
                            font-family: Helvetica, 'Microsoft YaHei', Arial, sans-serif;
                            font-weight: normal;
                            text-align: left;
                            white-space: nowrap;
                            line-height: 42rpx;
                        }
                    }

                    .icon_4 {
                        width: 44rpx;
                        height: 44rpx;
                        margin: 42rpx 20rpx 0 64rpx;
                    }
                }
            }

            .box_6 {
                width: 690rpx;
                height: 312rpx;
                margin: 22rpx 0 0 30rpx;

                .section_2 {
                    background-color: rgba(255, 255, 255, 1);
                    border-radius: 4px 4px 0px 0px;
                    width: 690rpx;
                    height: 104rpx;

                    .image-text_4 {
                        width: 168rpx;
                        height: 42rpx;
                        margin: 32rpx 0 0 30rpx;

                        .icon_5 {
                            width: 40rpx;
                            height: 40rpx;
                        }

                        .text-group_4 {
                            width: 118rpx;
                            height: 42rpx;
                            overflow-wrap: break-word;
                            color: rgba(0, 0, 0, 1);
                            font-size: 30rpx;
                            font-family: Helvetica, 'Microsoft YaHei', Arial, sans-serif;
                            font-weight: normal;
                            text-align: left;
                            white-space: nowrap;
                            line-height: 42rpx;
                        }
                    }

                    .icon_6 {
                        width: 16rpx;
                        height: 30rpx;
                        margin: 38rpx 34rpx 0 442rpx;
                    }
                }

                .section_3 {
                    background-color: rgba(255, 255, 255, 1);
                    width: 690rpx;
                    height: 104rpx;

                    .group_2 {
                        background-color: rgba(244, 244, 244, 1);
                        width: 630rpx;
                        height: 2rpx;
                        margin-left: 30rpx;
                    }

                    .group_3 {
                        width: 626rpx;
                        height: 42rpx;
                        margin: 30rpx 0 30rpx 30rpx;

                        .image-text_5 {
                            width: 168rpx;
                            height: 42rpx;

                            .icon_7 {
                                width: 40rpx;
                                height: 40rpx;
                            }

                            .text-group_5 {
                                width: 118rpx;
                                height: 42rpx;
                                overflow-wrap: break-word;
                                color: rgba(0, 0, 0, 1);
                                font-size: 30rpx;
                                font-family: Helvetica, 'Microsoft YaHei', Arial, sans-serif;
                                font-weight: normal;
                                text-align: left;
                                white-space: nowrap;
                                line-height: 42rpx;
                            }
                        }

                        .icon_8 {
                            width: 16rpx;
                            height: 30rpx;
                            margin-top: 6rpx;
                        }
                    }
                }

                .section_4 {
                    background-color: rgba(255, 255, 255, 1);
                    border-radius: 0px 0px 4px 4px;
                    width: 690rpx;
                    height: 104rpx;

                    .block_2 {
                        background-color: rgba(244, 244, 244, 1);
                        width: 630rpx;
                        height: 2rpx;
                        margin-left: 30rpx;
                    }

                    .block_3 {
                        width: 626rpx;
                        height: 42rpx;
                        margin: 30rpx 0 30rpx 30rpx;

                        .image-text_6 {
                            width: 168rpx;
                            height: 42rpx;

                            .icon_9 {
                                width: 40rpx;
                                height: 40rpx;
                            }

                            .text-group_6 {
                                width: 118rpx;
                                height: 42rpx;
                                overflow-wrap: break-word;
                                color: rgba(0, 0, 0, 1);
                                font-size: 30rpx;
                                font-family: Helvetica, 'Microsoft YaHei', Arial, sans-serif;
                                font-weight: normal;
                                text-align: left;
                                white-space: nowrap;
                                line-height: 42rpx;
                            }
                        }

                        .icon_10 {
                            width: 16rpx;
                            height: 30rpx;
                            margin-top: 6rpx;
                        }
                    }
                }
            }
        }

        .tab-bar_1 {
            box-shadow: 0px -2px 50px 0px rgba(0, 0, 0, 0.05);
            background-color: rgba(255, 255, 255, 1);
            height: 150rpx;
            width: 750rpx;
            position: relative;
            margin: 1430rpx 0 0 -750rpx;

            .text-wrapper_1 {
                width: 48rpx;
                height: 34rpx;
                margin: 50rpx 0 0 164rpx;

                .text_3 {
                    width: 48rpx;
                    height: 34rpx;
                    overflow-wrap: break-word;
                    color: rgba(51, 51, 51, 1);
                    font-size: 24rpx;
                    font-family: Source Han Sans-Regular;
                    font-weight: normal;
                    text-align: left;
                    white-space: nowrap;
                    line-height: 34rpx;
                }
            }

            .box_7 {
                position: absolute;
                left: 164rpx;
                top: 4rpx;
                width: 422rpx;
                height: 80rpx;

                .tab-bar-item_1 {
                    width: 48rpx;
                    height: 80rpx;

                    .icon_11 {
                        width: 48rpx;
                        height: 48rpx;
                    }

                    .text_3 {
                        width: 48rpx;
                        height: 34rpx;
                        overflow-wrap: break-word;
                        color: rgba(51, 51, 51, 1);
                        font-size: 24rpx;
                        font-family: Source Han Sans-Regular;
                        font-weight: normal;
                        text-align: left;
                        white-space: nowrap;
                        line-height: 34rpx;
                    }
                }

                .tab-bar-item_2 {
                    height: 34rpx;
                    margin-top: 46rpx;
                    width: 48rpx;

                    .text_4 {
                        width: 48rpx;
                        height: 34rpx;
                        overflow-wrap: break-word;
                        color: rgba(153, 153, 153, 1);
                        font-size: 24rpx;
                        font-family: Source Han Sans-Regular;
                        font-weight: normal;
                        text-align: left;
                        white-space: nowrap;
                        line-height: 34rpx;
                    }
                }
            }

            .icon_12 {
                position: absolute;
                left: 538rpx;
                top: 4rpx;
                width: 48rpx;
                height: 48rpx;
            }

            .image_2 {
                position: absolute;
                left: 0;
                top: 108rpx;
                width: 750rpx;
                height: 42rpx;
            }
        }
    }
}
</style>